<!DOCTYPE html>  
<html lang="en">  
<head>  
<meta charset="UTF-8">  
<meta name="viewport" content="width=device-width, initial-scale=1.0">  
<title>登录系统</title>  
<style>  
    body {  
        display: flex;  
        justify-content: center;  
        align-items: center;  
        height: 100vh;  
        margin: 0;  
        background-color: #f5f5f5;  
    }  
    .login-form {  
        text-align: center;  
    }  
    .login-form input[type="text"],  
    .login-form input[type="password"] {  
        width: 200px;  
        padding: 10px;  
        margin-bottom: 10px;  
    }  
    .login-form button {  
        padding: 10px 20px;  
    }  
</style>  
</head>  
<body>  
    <div class="login-form">  
        <h2>登录系统</h2>  
        <input type="text" id="username" placeholder="账号">  
        <input type="password" id="password" placeholder="密码">  
        <button onclick="login()">登录</button>  
    </div>  
  
    <script>  
    function login() {  
        // 获取账号密码  
        var username = document.getElementById('username').value;  
        var password = document.getElementById('password').value;  
          
        var adminUsername = "管理员123";  
            var adminPassword = "111111";  
  
            // 验证账号和密码  
            if (username === adminUsername && password === adminPassword) {  
                // 账号和密码匹配，跳转到新页面  
                window.location.href = 'hou.html';
            } else {  
                // 账号或密码不匹配，提示错误信息  
                alert("账号或密码错误，请重新输入！");  
                // 清空输入框，可选  
                document.getElementById('username').value = "";  
                document.getElementById('password').value = "";  
            }  
        }  
    </script>  
</body>  
</html>